/*
 定义一个 loading 插件
 使用这个插件 自动向页面 插入loading 视图（带样式）
 定义两个方法
 showLoading 显示  视图
 hideLoading 视图消失
*/
import LoadingTpl from './Loading.vue'
const loading = {
  // 注册组件的第三种方式
  install (Vue) {
    const Loading = Vue.extend(LoadingTpl)
    // Loading 是一个构造函数 new 这个构造函数 创建一个组件
    const LoadingComponent = new Loading()
    console.log(LoadingComponent.$mount().$el)
    // 返回当前组件的html结构
    document.body.appendChild(LoadingComponent.$mount().$el)
    Vue.prototype.$showLoading = () => {
      LoadingComponent.show = true
    }
    Vue.prototype.$hideLoading = () => {
      LoadingComponent.show = false
    }
  }
}

export default loading
